<template>
	<view>
		<u-navbar :background="background" :borderBottom="false">
			<view class="ft_16 fw-b">
				会员中心
			</view>
		</u-navbar>
		<view class="content">
			<view class="con_1 c-fff">
				<view class="p_bottom_10 display">
					<view class="ft_18 fw-b p_right_10">当前积分：{{vipInfo.dq_score}} </view>
					<view class="ft_10 dengji">{{vipInfo.level_name}}</view>
				</view>
				<view class="">
					<u-line-progress :show-percent="false" active-color="#ffffff" inactive-color="#ebd4a7" :round="true" :percent="vipInfo.percent" height="18"></u-line-progress>
				</view>
				<view class="ft_12">
					还差 {{vipInfo.haicha}} 积分升级至 {{vipInfo.title}}
				</view>
			</view>
			<view class="con_2">
				<view class="list display just_space" v-for="(item,index) in vipInfo.score" :key="index" :style="index+1==vipInfo.score.length?'border:none':''" v-if="vipInfo.score">
					<view class="">
						<view class="p_bottom_10 fw-b">
							{{item.title}}
						</view>
						<view class="ft_12 c-999">
							{{item.createtime}}
						</view>
					</view>
					<view class="" style="color: #E67920;">
						+{{item.score}}积分
					</view>
				</view>
			</view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{backgroundColor: '#ffffff',},
				vipInfo:{}, //会员信息
				
			}
		},
		onLoad() {
			this.getvipInfo() //获取会员信息
		},
		methods: {
			getvipInfo(){ //获取会员信息
				this.$myRequest('user/user_score',{})
				.then(res=>{
					console.log(res.data);
					if(res.data.code==1){
						this.vipInfo=res.data.data
						let info=this.vipInfo
						info.percent=Math.round((info.dq_score/info.zd_level.price)*100)
						info.haicha=Math.round((info.zd_level.price-info.dq_score)*100)/100
						info.title=info.zd_level.title
					}
				})
			},
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: #fafafa;
}
.content{
	.con_1{
		background: linear-gradient(180deg, #F8BA6A 0%, #E5C476 14%, #D5A446 72%, #D2A869 100%);padding: 15px;
		.dengji{
			padding: 2px 5px;border: 1px solid #eeeeee;border-radius: 30px;
		}
	}
	.con_2{
		padding: 0 15px;background-color: #FFFFFF;
		.list{
			padding: 15px 0;border-bottom: 1px solid #eeeeee; 
		}
	}
}

</style>
